// 4.4 
function ajax(options) {

    // 2.9 默认参数
    var defaults = {
        type: 'get',
        url: '',
        data: {},
        header: {
            'Content-Type': 'application/x-www-form-urlencoded',
        },
        success() { },
        error() { },
    };
    // 2.9-1.4 使用options对象中的属性覆盖defaults对象中的属性
    Object.assign(defaults, options);

    // 2.3-4.2 创建ajax对象
    var xhr = new XMLHttpRequest();
    // 2.4-5.2-1.1 创建拼接请求参数的变量
    var params = '';
    for (var attr in defaults.data) {
        // 将参数转换为字符串格式
        params += `${attr}=${defaults.data[attr]}&`;
    }
    params = params.substr(0, params.length - 1);

    // 2.4-5.3 判断请求方式，
    if (defaults.type == 'get') {
        defaults.url = defaults.url + '?' + params;
    }
    // console.log(params);

    // 2.3-4.5
    xhr.open(defaults.type, defaults.url);

    // 2.3-4.6
    // xhr.send();
    // 2.4-5.4 如果是post请求
    if (defaults.type == 'post') {

        // 2.6-1.4
        var contentType = defaults.header['Content-Type'];
        // 2.6-1.2 
        xhr.setRequestHeader('Content-Type', contentType);
        // 2.6-1.4
        if (contentType == 'application/json') {
            console.log('defaults.data', defaults.data);
            xhr.send(JSON.stringify(defaults.data));
        } else {
            xhr.send(params);
        }

    } else {
        xhr.send();
    }

    // 2.3-4.7
    // 监听xhr对象下面的onload事件，当xhr对象接收完响应数据后厨房
    xhr.onload = function () {
        // 2.3-4.9-2,2.3-4.9-3
        // options.success(xhr.responseText);

        // 2.8-3.3 看一下当前响应的数据类型是什么
        let res1 = xhr.getResponseHeader('Content-Type');
        console.log('res1', res1);
        var responseText = xhr.responseText;
        // 如果响应类型中，包含json
        if (res1.includes('application/json')) {
            responseText = JSON.parse(responseText);
        }

        // 2.7 完善-2.2
        if (xhr.status == 200) {
            defaults.success(responseText, xhr);
        } else {
            defaults.error(responseText, xhr);
        }
    }
    // 当网络中断时
    xhr.onerror = function () {
        // 调用失败回调函数并且将xhr对象传递给回调函数
        defaults.error(xhr);
    }
}
